<template>
	<div class="ledger_table">
		<div class="header">
			<h2>{{ title }}</h2>
			<router-link :to="`/stat/${type}`" v-if="!!type">
				更多
				<i class="el-icon-d-arrow-right"></i>
			</router-link>
		</div>
		<el-table :data="data" stripe>
			<el-table-column label="序号" type="index" width="48" align="center" />
			<el-table-column label="头像地址" width="80">
				<template slot-scope="{ row }">
					<img class="avatar_image" :src="row.avatar" />
				</template>
			</el-table-column>
			<el-table-column label="姓名" prop="name" />
			<el-table-column label="用户性别" align="center" min-width="72">
				<template slot-scope="{ row }">
					<dict-tag :options="dicts.sys_user_sex" :value="row.gender" />
				</template>
			</el-table-column>
			<el-table-column label="手机号码" prop="phoneNumber" min-width="110" />
			<el-table-column label="用户邮箱" prop="email" min-width="164" show-overflow-tooltip />
			<el-table-column label="身份证" prop="idCard" min-width="164" />
			<el-table-column label="最高学历" align="center" min-width="80">
				<template slot-scope="{ row }">
					<dict-tag :options="dicts.sp_highest_degree" :value="row.highestDegree" />
				</template>
			</el-table-column>
			<el-table-column label="身份类型" align="center" min-width="90">
				<template slot-scope="{ row }">
					<dict-tag :options="dicts.sp_people_type" :value="row.identityType" />
				</template>
			</el-table-column>
			<el-table-column label="涉密等级" align="center" min-width="80">
				<template slot-scope="{ row }">
					<dict-tag :options="dicts.sp_level" :value="row.spLevel" />
				</template>
			</el-table-column>
			<el-table-column label="操作" align="center" width="64">
				<template slot-scope="{ row }">
					<el-button size="small" type="text" icon="el-icon-view" @click="handleLookDetail(row.userId)" v-hasPermi="['spm:user:query']">
						详情
					</el-button>
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script>
export default {
	props: {
		type: { type: String, default: '' },
		title: { type: String, default: '' },
		data: { type: Array, default: () => [] },
		dicts: { type: Object, default: () => {} }
	},
	methods: {
		//查看涉密人员详情
		handleLookDetail(id) {
			this.$router.push({
				path: '/peoples/user-detail/' + id
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.ledger_table {
	margin-bottom: 20px;
	.header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 12px;
		h2 {
			margin: 0;
			color: #606266;
			line-height: 1;
			font-size: 16px;
			font-weight: bold;
		}
		a {
			line-height: 1;
			font-size: 14px;
			color: #606266;
			&:hover {
				color: var(--current-color);
			}
		}
	}
	.el-table {
		border: solid 1px #e6ebf5;
		border-bottom: none;
		width: 100%;
	}
}
.avatar_image {
	display: block;
	width: 60px;
	height: 60px;
	object-fit: cover;
}
</style>
